<template>
  <div class="home">
    <!-- 标题 -->
    <div class="nav-bar">
      <div class="title">弘源旅途</div>
    </div>
    <!-- 图片 -->
    <div class="banner">
      <img src="@/assets/img/home/banner.webp" alt="">
    </div>
    <!-- 搜索盒子 -->
    <SearchBoxVue></SearchBoxVue>
  </div>
</template>

<script setup>
  import SearchBoxVue from './SearchBox/SearchBox.vue';
</script>

<style lang="less" scoped>
  .nav-bar {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 46px;
    border: 1px solid #f2f2f2;

    .title {
      color: var(--primary-color);
      font-size: 18px;
      font-weight: 700;
    }
  }
  .banner {
    img {
      width: 100%;
    }
  }
</style>
